<template>
    <RouterView/>
    <van-tabbar v-model="active">
        <van-tabbar-item 
        v-for="item in router.options.routes[0].children" 
        :key="item.path" 
        :icon="item.meta.icon"
        :url="`#/${item.path}`">{{item.meta.name}}</van-tabbar-item>
    </van-tabbar>
</template>

<script setup lang="ts">
import {ref,onMounted} from 'vue'
import { useRouter,useRoute } from 'vue-router';
const active=ref(0)
const router=useRouter()
const route=useRoute()
onMounted(()=>{
   const data= router.options.routes[0]
   // 找到当前路由在data.children中的索引
   active.value=data.children?.findIndex(item=>'/'+item.path===route.path)
   
})

</script>